<template>
	<view class="content">
		<view class="header">
			<image class="logo" @click="goindex()" :src="_baseURL + setting.site_logo" mode=""></image>
			<view class="nologin" v-if="showinfonav">
				<view class="to-login" @click="gologin()">登录</view>
				<!-- <view class="com-btn" @click="goregister()">注册</view> -->
			</view>
			<view v-else class="after-login">
				<view class="balance">
					<image class="jinbi" src="../../static/img/jinbi.png" mode=""></image>
					<view class="yue">${{userinfo.money}}</view>
					<image @click="getrefresh()" class="shuaxin" :class="isrefresh ? 'ssssxuanzhuan':''"
						src="../../static/img/shuaxin.png" mode=""></image>
					<view class="qianbao">
						<image src="../../static/img/qianbao.png" mode=""></image>
					</view>
				</view>
				<view class="com-my" @click="gouserindex()">
					<image src="../../static/img/avatar.webp" mode=""></image>
				</view>
			</view>
		</view>
		<liuyuno-tabs ref="liuyuno" :tabData="tabs" :defaultIndex="defaultIndex" @tabClick='tabClick' />
		<view class="main">
			<view class="invite-friend-card">
				<!-- <view class="head">邀请好友</view> -->
				<view class="card-info-cell">
					<view class="cictitle">推荐链接</view>
					<view class="copy-value-cell">
						<view> {{yqmurl}} </view>
						<view class="copy" @click="copy(yqmurl)">
							<image src="../../static/img/copy1.png" mode=""></image>
							<view>复制</view>
						</view>
					</view>
				</view>
				<!-- <view class="card-info-cell">
					<view class="cictitle">推荐代码</view>
					<view class="copy-value-cell">
						<view>{{userinfo.invite_code}}</view>
						<view class="copy" @click="copy(userinfo.invite_code)">
							<image src="../../static/img/copy1.png" mode=""></image>
							<view>复制</view>
						</view>
					</view>
				</view> -->
				<view class="card-info-cell">
					<view class="cictitle">分享通过</view>
					<view class="share-obj">
						<image src="../../static/newImg/4.png" mode=""></image>
						<image src="../../static/newImg/5.png" mode=""></image>
						<image src="../../static/img/share.png" mode=""></image>
						<image src="../../static/img/share.png" mode=""></image>
						<image src="../../static/img/share.png" mode=""></image>
						<image src="../../static/img/share.png" mode=""></image>
					</view>
				</view>
				<view class="table-data">
					<view class="data-cell">
						<view class="data-cell-item">
							<view class="text">{{todayxznum}}</view>
							<view class="text1">今日新增人数</view>
						</view>
						<view class="data-cell-item1">
							<view class="text">{{todayzsnum}}</view>
							<view class="text1">直属人数</view>
						</view>
					</view>
					<view class="data-cell">
						<view class="data-cell-item">
							<view class="text2">{{todaytuanduinum}}</view>
							<view class="text1">今日团队新增人数</view>
						</view>
						<view class="data-cell-item1">
							<view class="text2">{{tuanduinum}}</view>
							<view class="text1">团队总人数</view>
						</view>
					</view>
				</view>
			</view>
			<view class="invite-friend-card">
				<view class="card-info-cell">
					<view class="name">
						<view class="nameleft">
							<image src="../../static/img/jinbi1.png" mode=""></image>
							<view>佣金奖励</view>
						</view>
						<view class="nameright" @click="linggurecord()">
							<view>领取记录</view>
							<image src="../../static/img/right.png" mode=""></image>
						</view>
					</view>
					<view class="info">
						<view class="infoleft">
							<image src="../../static/img/bizhong.png" mode=""></image>
							<view>{{yj}}</view>
						</view>
						<!-- <view class="inforight">领取</view> -->
					</view>
				</view>
			</view>
			<view class="item-head">
				<image src="../../static/img/wenhao.png" mode=""></image>
				<view>常见问题解答</view>
			</view>
			<view class="dorp-menu">
				<view class="van-collapse-item">
					<view class="van-collapse">
						<view class="van-cell__title">推荐系统是如何运行的?</view>
						<image v-if="list == 0" @click="list = -1" src="../../static/img/zhankai.png" mode=""></image>
						<image v-else @click="list = 0" src="../../static/img/shouqi.png" mode=""></image>
					</view>
					<view class="van-cell__con" v-if="list == 0"> 通过您的推荐链接注册或玩家注册时输入您的专属推荐代码，在太平洋娱乐进行游戏，你就可以获得推荐奖励和佣金
					</view>
				</view>
				<view class="van-collapse-item">
					<view class="van-collapse">
						<view class="van-cell__title">自己的业绩等及佣金在哪里查看?</view>
						<image v-if="list == 1" @click="list = -1" src="../../static/img/zhankai.png" mode=""></image>
						<image v-else @click="list = 1" src="../../static/img/shouqi.png" mode=""></image>
					</view>
					<view class="van-cell__con" v-if="list == 1"> 点击我的-邀请好友即可查看您的业绩详情，佣金等级点击返佣比例即可查询 
					</view>
				</view>
				<view class="van-collapse-item">
					<view class="van-collapse">
						<view class="van-cell__title">充值提现有什么要求?</view>
						<image v-if="list == 2" @click="list = -1" src="../../static/img/zhankai.png" mode=""></image>
						<image v-else @click="list = 2" src="../../static/img/shouqi.png" mode=""></image>
					</view>
					<view class="van-cell__con" v-if="list == 2"> 充值页面提供充值通道，最低充值金额为10U，最低提款金额为10U 
					</view>
				</view>
				<view class="van-collapse-item">
					<view class="van-collapse">
						<view class="van-cell__title">佣金多久结算?</view>
						<image v-if="list == 3" @click="list = -1" src="../../static/img/zhankai.png" mode=""></image>
						<image v-else @click="list = 3" src="../../static/img/shouqi.png" mode=""></image>
					</view>
					<view class="van-cell__con" v-if="list == 3"> 代理佣金为日结算，每日北京时间00:00:00-23:59:59为一个周期，当日业绩达到多少按照佣金表进行返佣  
					</view>
				</view>
			</view>
		</view>
		<view class="tabbars">
			<view class="tabber-item active" @click="nivagete(0)">
				<view class="tiicon">
					<svg t="1731115207647" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="19190" width="25" height="25">
						<path
							d="M571.2 502.4c60.8-24 104-83.2 104-152 0-91.2-73.6-163.2-163.2-163.2s-163.2 73.6-163.2 163.2c0 68.8 43.2 128 104 152-134.4 28.8-236.8 147.2-236.8 291.2 0 35.2 24 46.4 44.8 56h1.6c80 28.8 193.6 35.2 248 35.2 60.8 0 177.6-9.6 256-36.8 28.8-11.2 44.8-30.4 44.8-54.4-4.8-142.4-105.6-262.4-240-291.2z"
							p-id="19191" fill="#fff"></path>
						<path
							d="M372.8 489.6c-38.4-36.8-62.4-88-62.4-145.6 0-70.4 36.8-131.2 91.2-166.4L400 176s0-1.6-1.6-1.6c-28.8-24-65.6-36.8-102.4-36.8-91.2 0-163.2 73.6-163.2 163.2 0 68.8 43.2 128 104 152C100.8 483.2 0 603.2 0 745.6c0 25.6 14.4 43.2 44.8 54.4 44.8 14.4 97.6 24 137.6 28.8-1.6-12.8-1.6-25.6-1.6-40-1.6-132.8 78.4-248 192-299.2z m414.4-35.2c60.8-24 104-83.2 104-152 0-91.2-73.6-163.2-163.2-163.2-38.4 0-75.2 12.8-104 36.8l-4.8 3.2c54.4 36.8 88 99.2 88 164.8 0 57.6-24 108.8-62.4 145.6 115.2 51.2 193.6 166.4 193.6 300.8 0 14.4-1.6 27.2-3.2 40 40-4.8 97.6-14.4 144-30.4 28.8-11.2 44.8-30.4 44.8-54.4 0-142.4-102.4-262.4-236.8-291.2z"
							p-id="19192" fill="#fff"></path>
					</svg>
					
					<!-- <image class="tiicon1" src="../../static/tabbar/12.png" mode=""></image> -->
				</view>
				<view>团队</view>
			</view>
			<view class="tabber-item" @click="nivagete(1)">
				<view class="tiicon">
					<svg t="1731115630976" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="37824" width="30" height="30">
						<path
							d="M805.376 512c0-57.856-16.896-112.128-46.08-158.208 14.336-19.968 23.04-44.032 23.04-70.144 0-66.048-53.76-119.808-120.32-119.808-43.008 0-80.384 22.528-101.888 56.32-17.408-3.072-34.816-4.608-52.736-4.608C376.32 215.04 264.704 300.032 225.28 417.28c-54.784 11.264-95.744 59.392-95.744 117.248 0 65.024 52.224 117.76 116.736 119.808 50.688 91.648 148.48 154.112 261.12 154.112 21.504 0 43.008-2.56 62.976-6.656 20.992 34.816 59.392 58.368 102.912 58.368 66.56 0 120.32-53.76 120.32-119.808 0-30.208-11.264-57.344-29.696-78.336C790.016 617.984 805.376 566.784 805.376 512zM507.392 751.616c-84.992 0-159.744-44.032-202.24-110.592 38.4-19.968 65.024-59.904 65.024-106.496 0-53.76-35.84-99.328-84.992-114.688 36.352-87.04 122.368-147.968 222.208-147.968 11.776 0 23.552 1.024 34.816 2.56 0 3.072-0.512 5.632-0.512 8.704 0 66.048 53.76 119.808 120.32 119.808 18.944 0 36.864-4.608 52.736-12.288 20.992 35.328 32.768 76.8 32.768 120.832 0 42.496-11.264 82.432-30.72 116.736-13.824-5.12-28.16-8.192-44.032-8.192-66.56 0-120.32 53.76-120.32 119.808 0 2.56 0 4.608 0.512 7.168C538.624 750.08 523.264 751.616 507.392 751.616z"
							p-id="37825" fill="#909FAC"></path>
					</svg>
					<!-- <image class="tiicon1" src="../../static/tabbar/13.png" mode=""></image> -->
				</view>
				<view>团队管理</view>
			</view>
			<view class="tabber-item" @click="nivagete(2)">
				<view class="tiicon">
					<svg t="1731115761345" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="41553" width="25" height="25">
						<path
							d="M829.866667 119.466667H187.733333c-53.333333 0-96 42.666667-96 96v413.866666c0 53.333333 42.666667 96 96 96h241.066667v117.333334H298.666667h-2.133334c-12.8 0-23.466667 10.666667-23.466666 23.466666s10.666667 23.466667 23.466666 23.466667H704c12.8 0 23.466667-10.666667 23.466667-23.466667s-10.666667-23.466667-23.466667-23.466666h-130.133333V725.333333H832c53.333333 0 96-42.666667 96-96V215.466667c-2.133333-51.2-44.8-96-98.133333-96z m-42.666667 142.933333s0 2.133333 0 0v2.133333L548.266667 582.4l-6.4-4.266667-187.733334-136.533333-66.133333 85.333333c-6.4 10.666667-19.2 14.933333-29.866667 10.666667-12.8-4.266667-19.2-19.2-14.933333-32 0-2.133333 0-2.133333 2.133333-4.266667l89.6-117.333333 8.533334-10.666667 194.133333 142.933334 211.2-279.466667c6.4-6.4 17.066667-8.533333 25.6-4.266667 12.8 4.266667 19.2 17.066667 12.8 29.866667z"
							p-id="41554" fill="#909FAC"></path>
					</svg>
					<!-- <image class="tiicon1" src="../../static/tabbar/15.png" mode=""></image> -->
				</view>
				<view>业绩查询</view>
			</view>
			<view class="tabber-item" @click="nivagete(3)">
				<view class="tiicon">
					<svg t="1731116029421" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="61733" width="22" height="22">
						<path
							d="M734.89 453.068H285.157c-16.58 0-27.13-16.38-27.13-31.635 0-15.27 14.007-30.535 30.578-30.535h448.444c16.58 0 30.587 14.14 31.83 30.535 0.006 15.25-17.448 31.635-33.987 31.635z m0 186.516H285.157c-16.58 0-27.13-16.385-27.13-31.65 0-15.25 14.007-30.52 30.578-30.52h448.444c16.58 0 30.587 14.14 31.83 30.52 0.006 15.265-17.448 31.65-33.987 31.65z m5.987 186.51h-449.74c-16.565 0-33.105-18.691-33.105-33.94 0-15.204 14-28.23 30.582-28.23h448.439c16.566 0 30.572 11.834 31.83 28.23 0 15.264-11.435 33.94-28.006 33.94z m28.007-746.058c0 73.674-39.273 124.34-106.428 124.34H343.172c-66.856 0.006-85.14-63.32-85.14-124.34h-95.787c-44.82 0-74.499 29.71-74.499 79.939v767.371c0 56.344 28.714 85.264 79.82 85.264H859.35c42.637 0 79.82-27.769 79.82-85.264V159.975c0-55.472-35.047-79.939-85.14-79.939h-85.146z m-117.632-62.17h-275.62c-33.817 0-60.838 27.77-60.838 62.093 0 34.4 27.083 62.248 60.839 62.248H652.95c32.104 0 59.177-27.847 59.177-62.248 0.016-34.318-27.042-62.093-60.875-62.093z"
							p-id="61734" fill="#909FAC"></path>
					</svg>
					<!-- <image class="tiicon1" src="../../static/tabbar/17.png" mode=""></image> -->
				</view>
				<view>代理报表</view>
			</view>
			<!-- <view class="tabber-item" @click="nivagete(4)">
				<view class="tiicon">
					<image class="tiicon1" src="../../static/tabbar/19.png" mode=""></image>
				</view>
				<view>代理介绍</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	import liuyunoTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
	import {
		getuserinfo,
		hytj,
		sysconfig
	} from '../../api/api.js'
	import { baseURL } from '../../api/http.js'
	export default {
		components: {
			liuyunoTabs
		},
		data() {
			return {
				tabs: [
					'首页',
					'电子',
					'真人',
					'彩票',
					'体育',
					'电竞',
					'捕鱼',
					'棋牌'
				],
				defaultIndex: 0,

				showinfonav: true,
				userinfo: [],
				isrefresh: false,

				list: 0,
				yqmurl: '',
				todaytuanduinum: 0,
				todayxznum: 0,
				todayzsnum: 0,
				tuanduinum: 0,
				yj: 0,
				
				_baseURL: baseURL,
				setting: []
			}
		},
		onLoad() {
			if (uni.getStorageSync('userinfo')) {
				this.userinfo = JSON.parse(uni.getStorageSync('userinfo'))
			}
			if (uni.getStorageSync('token')) {
				this.showinfonav = false
				this.getuserinfo()
			}
			this.getsysconfig()
		},
		methods: {
			getsysconfig() {
				sysconfig().then(res => {
					if (res.data.status.errorCode == 0) {
						this.setting = res.data.data
						this.yqmurl = res.data.data.app_link
					} else {
						uni.showToast({
							title: res.data.status.msg,
							icon: 'error',
							duration: 2000
						});
					}
				}).catch(err => {
					console.log(err)
				})
			},
			nivagete(d) {
				if (d == 0) {
					uni.navigateTo({
						url: '/pages/index/invitation'
					})
				} else if (d == 1) {
					uni.navigateTo({
						url: '/pages/teamManage/teamManage'
					})
				} else if (d == 2) {
					uni.navigateTo({
						url: '/pages/performInquiry/performInquiry'
					})
				} else if (d == 3) {
					uni.navigateTo({
						url: '/pages/agentReport/agentReport'
					})
				}

			},
			linggurecord() {
				uni.navigateTo({
					url: '/pages/yjrecord/yjrecord'
				})
			},
			tabClick(e) {
				console.log(e)
			},
			getrefresh() {
				let that = this;
				this.isrefresh = true;
				setTimeout(function() {
					that.isrefresh = false;
				}, 1000)
				this.getuserinfo();
			},
			getuserinfo() {
				getuserinfo().then(res => {
					if (res.data.status.errorCode == 0) {
						this.userinfo = res.data.data.member
						// this.yqmurl = window.location.origin + '/#/pages/login/register?code=' + res.data.data
						// 	.member.invite_code
						// console.log(window.location.origin, 'window.location')
					} else {
						uni.showToast({
							title: res.data.status.msg,
							icon: 'error',
							duration: 2000
						});
					}
				}).catch(err => {
					console.log(err)
				})

				hytj().then(res => {
					this.todaytuanduinum = res.data.data.todaytuanduinum
					this.todayxznum = res.data.data.todayxznum
					this.todayzsnum = res.data.data.todayzsnum
					this.tuanduinum = res.data.data.tuanduinum
					this.yj = res.data.data.yj

					console.log(res, 'res----')
				})
			},
			copy(value) {
				uni.setClipboardData({
					data: value,
					success: function() {
						//调用方法成功
						uni.showToast({
							title: '复制成功',
							icon: 'success',
							duration: 2000
						});
					}
				})
			},
			gologin() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			goregister() {
				uni.navigateTo({
					url: '/pages/login/register'
				})
			},
			gouserindex() {
				uni.navigateTo({
					url: '/pages/user/index'
				})
			},
			goindex() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			}
		}
	}
</script>

<style scoped>
	* {
		box-sizing: border-box;
	}

	/deep/ *::-webkit-scrollbar {
		display: none;
	}

	/deep/ * {
		-ms-overflow-style: none;
		/* IE and Edge */
		scrollbar-width: none;
		/* Firefox */
	}

	.content {
		width: 100%;
		min-height: 100vh;
		background: #212125;
	}

	.header {
		width: 100%;
		height: 100rpx;
		padding-right: 24rpx;
		padding-left: 39rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.logo {
		width: 100rpx;
		height: 80rpx;
	}

	.nologin,
	.after-login {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.to-login {
		word-break: break-all;
		text-align: center;
		font-weight: 700;
		margin-right: 40rpx;
		font-size: 26rpx;
		color: #fff;
		padding-top: 8rpx;
	}

	.com-btn {
		display: flex;
		justify-content: center;
		align-items: center;
		min-width: 204rpx;
		height: 64rpx;
		background: #fee619;
		box-shadow: 0 8rpx 0 0 #d9a715, inset 0 0 24rpx 6rpx rgba(243, 48, 48, .34), 0 4rpx 12rpx 6rpx rgba(255, 123, 1, .34);
		border-radius: 12rpx;
		font-weight: 700;
		padding-top: 8rpx;
		font-size: 26rpx;
		color: #1c1e22;
		word-break: break-all;
		text-align: center;
	}

	.balance {
		display: flex;
		justify-content: space-between;
		align-items: center;
		min-width: 160rpx;
		max-width: 400rpx;
		height: 70rpx;
		padding-left: 32rpx;
		background: #14161a;
		border-top-left-radius: 10rpx;
		border-bottom-left-radius: 10rpx;
	}

	.jinbi {
		width: 32rpx;
		height: 28rpx;
	}

	.yue {
		font-size: 30rpx;
		padding-left: 10rpx;
		font-weight: 600;
		color: #fff;
	}

	.shuaxin {
		width: 30rpx;
		height: 30rpx;
		margin-left: 22rpx;
		margin-right: 16rpx;
	}

	.ssssxuanzhuan {
		animation: rotatefresh 1s;
	}

	@keyframes rotatefresh {
		from {
			transform: rotate(0deg);
		}

		to {
			transform: rotate(360deg);
			transition: all 0.6s;
		}
	}

	.qianbao {
		width: 72rpx;
		height: 66rpx;
		border-top-right-radius: 10rpx;
		border-bottom-right-radius: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #fee619;
		box-shadow: 0 2rpx 0 0 #d9a715, inset 0 0 24rpx 6rpx rgba(243, 48, 48, .34), 0 4rpx 12rpx 6rpx rgba(255, 123, 1, .34);
	}

	.qianbao image {
		width: 30rpx;
		height: 30rpx;
	}

	.com-my {
		width: 70rpx;
		height: 78rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 30rpx;
		padding-top: 8rpx;
		border-radius: 50%;
		overflow: hidden;
	}

	.com-my image {
		width: 70rpx;
		height: 70rpx;
	}

	.main {
		width: 100%;
		height: calc(100vh - 302rpx);
		overflow-y: scroll;
		padding: 20rpx 24rpx;
		padding-bottom: 0;
		background: #22252a;
		border-top: 2rpx solid #17181b;
	}

	.invite-friend-card {
		width: 100%;
		padding: 18rpx 22rpx 32rpx 22rpx;
		margin-bottom: 28rpx;
		background-color: #1c1e22;
		border-radius: 6rpx;
		color: #fff;
	}

	.head {
		width: 100%;
		font-size: 30rpx;
		font-weight: 700;
		margin-bottom: 24rpx;
		padding: 20rpx;
		padding-left: 28rpx;
	}

	.card-info-cell {
		margin-bottom: 36rpx;
	}

	.cictitle {
		font-size: 24rpx;
	}

	.copy-value-cell {
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: rgb(36, 38, 43);
		margin: 22rpx 0 34rpx 0;
		border-radius: 6rpx;
		font-size: 24rpx;
		overflow: hidden;
	}

	.copy {
		width: 120rpx;
		height: 96rpx;
		display: flex;
		font-size: 24rpx;
		border-radius: 6rpx;
		background: rgb(62, 65, 70);
		justify-content: center;
		align-items: center;
	}

	.copy image {
		width: 26rpx;
		height: 26rpx;
	}

	.share-obj {
		margin-top: 22rpx;
	}

	.share-obj image {
		width: 70rpx;
		height: 70rpx;
		margin-right: 40rpx;
	}

	.share-obj image:last-child {
		margin-right: 0;
	}

	.table-data {
		background: #24262b;
		border-radius: 6rpx;
	}

	.data-cell {
		display: flex;
		position: relative;
		height: 130rpx;
	}

	.table-data .data-cell:first-child::after {
		content: "";
		width: 94%;
		height: .02667rem;
		position: absolute;
		left: 50%;
		bottom: 0;
		transform: translate(-50%);
		background: #303439;
	}

	.data-cell-item {
		padding-left: 70rpx;
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: flex-start;
		flex-direction: column;
	}

	.data-cell-item1 {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: flex-start;
		flex-direction: column;
	}

	.text {
		font-weight: 700;
		font-size: 40rpx;
	}

	.text1 {
		font-size: 28rpx;
		color: #97a6b4;
	}

	.text2 {
		font-weight: 700;
		font-size: 40rpx;
		color: #ffca01;
	}

	.name {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.nameleft {
		margin-bottom: 22rpx;
		font-size: 24rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.nameleft image {
		width: 26rpx;
		height: 21rpx;
		margin-right: 8rpx;
	}

	.nameright {
		margin-bottom: 20rpx;
		font-size: 24rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		color: #a6b2c0;
	}

	.nameright image {
		width: 26rpx;
		height: 25rpx;
		margin-left: 6rpx;
	}

	.info {
		height: 80rpx;
		border-radius: 6rpx;
		background: #24262b;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.infoleft {
		display: flex;
		align-items: center;
		padding-left: 20rpx;
	}

	.infoleft image {
		width: 40rpx;
		height: 40rpx;
	}

	.infoleft view {
		font-size: 40rpx;
		color: #ffca01;
		font-weight: 700;
		padding-left: 24rpx;
	}

	.inforight {
		width: 120rpx;
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 6rpx;
		background-color: #3e4146;
		font-size: 24rpx;
	}

	.item-head {
		padding: 44rpx 0 28rpx 0;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.item-head image {
		width: 32rpx;
		height: 32rpx;
	}

	.item-head view {
		font-size: 30rpx;
		font-weight: 700;
		padding-left: 12rpx;
		color: #fff;
	}

	.dorp-menu {
		margin-bottom: 60rpx;
	}

	.van-collapse-item {
		border-bottom: 2rpx solid #303439;
	}

	.van-collapse-item:last-child {
		border-bottom: 0;
	}

	.van-collapse {
		background: #22252a;
		padding: 40rpx 30rpx 40rpx 0;
		display: flex;
		width: 100%;
		overflow: hidden;
		color: #96a5b2;
		font-size: 28rpx;
	}

	.van-cell__title {
		flex: 1;
		font-size: 26rpx;
		color: #fff;
		line-height: 48rpx;
	}

	.van-collapse image {
		width: 40rpx;
		height: 40rpx;
	}

	.van-cell__con {
		background: #22252a !important;
		padding: 0 0 30rpx 0;
		line-height: 33rpx;
		color: #969799;
		font-size: 22rpx;
	}

	.tabbars {
		position: fixed;
		display: flex;
		width: 100%;
		height: calc(112rpx + env(safe-area-inset-bottom));
		background: #1e1f23;
		bottom: 0;
		left: 0;
		z-index: 888;
		padding-bottom: env(safe-area-inset-bottom);
	}

	.tabber-item {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		height: 112rpx;
		position: relative;
		width: 25%;
	}

	.tiicon {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 40rpx;
	}

	.tiicon1 {
		width: 40rpx;
		height: 36rpx;
	}

	.tabber-item view {
		font-size: 22rpx;
		color: #a6aeb9;
		margin-top: 10rpx;
	}

	.tabber-item.active view {
		color: #fff;
	}
</style>